<!DOCTYPE html>
<html lang="zh-cn">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<title>date-selector</title>
		<style>
			* {
				margin: 0;
				padding: 0;
			}
			#box {
				display: inline-block;
				padding: 8px;
				color: #929292;
				border: 1px solid #333;
				margin-top: 10px;
				margin-left: 10px;
				font-size: 14px;
				cursor: pointer;
			}
		</style>
		<link rel="stylesheet" href="./lib/index.css" />
	</head>
	<body>
		<div style="height:1000px;">
			<div id="box">我是一个输入框</div>
		</div>
		<script src="./src/index.js"></script>
		<script>
			var selector = new DateSelector({
				target: document.querySelector('#box'),
				className: 'my-class-name',
				disabledDate(date) {
					return Date.parse(date) > Date.parse(new Date());
				},
				data: [['2019-3-11', '2019-04-15']],
				max: 5,
				change({ data, current, index }) {
					console.log('当前变化', data, current, index);
				},
				auto: true,
				confirm(data) {
					console.log('确认结果', data);
				},
			});
			document.body.querySelector('#box').addEventListener('click', () => {
				selector.toggle();
			});
		</script>
	</body>
</html>
